<template>
    <div class="usermanage-main">
            <div class="menu">
                <el-menu
                        default-active="2"
                        class="el-menu-vertical-demo"
                        @open="handleOpen"
                        @close="handleClose">
                    <el-submenu index="1">
                        <template slot="title">
                            <i class="el-icon-folder"></i>
                            <span>简历管理</span>
                        </template>
                        <el-menu-item-group>
                            <router-link to="/usermanage/">
                                <el-menu-item index="1-1">创建简历</el-menu-item>
                            </router-link>
                            <router-link to="/usermanage/myresume">
                                <el-menu-item index="1-2">我的简历</el-menu-item>
                            </router-link>
                        </el-menu-item-group>
                    </el-submenu>

                    <el-submenu index="2">
                        <template slot="title">
                            <i class="el-icon-notebook-1"></i>
                            <span slot="title">求职管理</span>
                        </template>
                        <el-menu-item-group>
                            <router-link to="/usermanage/feedback">
                                <el-menu-item index="2-1">求职反馈</el-menu-item>
                            </router-link>
                            <router-link to="/usermanage/favorites">
                                <el-menu-item index="2-2">收藏夹</el-menu-item>
                            </router-link>
                        </el-menu-item-group>
                    </el-submenu>

                    <el-submenu index="3">
                        <template slot="title">
                            <i class="el-icon-s-custom"></i>
                            <span slot="title">账号管理</span>
                        </template>
                        <el-menu-item-group>
                            <router-link to="/usermanage/information">
                                <el-menu-item index="3-1">基本信息</el-menu-item>
                            </router-link>
                            <el-menu-item index="3-2">安全退出</el-menu-item>
                        </el-menu-item-group>
                    </el-submenu>
                </el-menu>
            </div>

            <div class="menu-show">
                <router-view/>
            </div>
    </div>
</template>

<script>

    export default {
        name: 'usermanage-main',
        methods: {
            handleOpen(key, keyPath) {
                console.log(key, keyPath);
            },
            handleClose(key, keyPath) {
                console.log(key, keyPath);
            }
        },
        data(){
            return{
                index:'1',
            }
        }
    }
</script>

<style>
    .usermanage-main{
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        background-color: #F3F5F8;
        /*height: 570px;*/
    }
    .menu{
        margin-top: 15px;
        margin-left: 15%;
        width: 200px;
        padding-bottom: 15px;

    }

    .menu-show{
        margin-top: 15px;
        background-color: white;
        margin-left: 20px;
        width: 50%;
        /*padding-bottom: 15px;*/
        margin-bottom: 15px;
        box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.1);

    }
</style>
